<template>
  <div class="file">
    <div class="header">
      <x-header :left-options="{ backText: '' }">
        <header-title :title="$t('file.fileUploadAndDownload')" />
      </x-header>
    </div>

    <div class="file-list">
      <group>
        <cell :title="$t('file.dataflowDownload')" is-link @click.native="routeDataFlowDownload" />
        <cell :title="$t('file.staticResourceDownload')" is-link @click.native="routeStaticResourceDownload" />
      </group>
    </div>
  </div>
</template>

<script>
import { XHeader, Group, Cell } from 'vux';
import HeaderTitle from '@/components/common/HeaderTitle';

export default {
  components: {
    Group,
    Cell,
    XHeader,
    HeaderTitle,
  },
  data() {
    return {
      files: [],
      isDownload: false,
    };
  },
  methods: {
    routeDataFlowDownload() {
      this.$router.push('/file/dataflow');
    },
    routeStaticResourceDownload() {
      this.$router.push('/file/static-resource');
    },
  },
};
</script>

<style lang="less" scoped>
.file {
  height: 100%;
  overflow: hidden;
  .header {
    position: relative;
    height: 45px;
  }
  /deep/ .vux-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10;
  }
  .file-list {
    position: relative;
    width: 100%;
    height: calc(100% - 45px);
    overflow-y: auto;
    .icon-download {
      width: 33px;
      margin-left: 10px;
      text-align: center;
    }
  }
}
</style>
